<template>
    <!-- 搜索页 -->
    <div class="search">
        <div class="search-input">
            <form action="/">
                <van-search shape="round" background="#f6a088" v-model="value" show-action placeholder="请输入搜索关键词" @search="onSearch" @cancel="onCancel" />
            </form>
        </div>
    </div>
</template>

<script>
import { Toast } from 'vant';

export default {
    data() {
        return {
            value: '',
        };
    },
    methods: {
        onSearch(val) {
            Toast("待完善中，吃货请等待~");
        },
        onCancel() {
            // Toast('取消');
            this.$router.push('/');
        },
    },
};
</script>

<style lang="less" scoped>
@import url(../common/less/varible.less);
.search {
    width: 100%;
    .search-input {
        width: 100%;
        padding: 10px 0;
        background-color: @borderColor;
    }
}
</style>